<template>
  <h1>El-日期时间选择器组件</h1>
  <el-date-picker
      type="date"
      v-model="rq"
      format="YYYY-MM-DD"
      value-format="YYYY-MM-DD"
      @change="console.log(rq)"
  >
  </el-date-picker>
  <el-date-picker
      type="time"
      v-model="time"
      format="YYYY-MM-DD HH-mm-ss"
      value-format="YYYY-MM-DD HH-mm-ss"
      @change="console.log(rq)"
  >
  </el-date-picker>
  <el-date-picker
      type="datetimerange"
      v-model="times"
      format="YYYY-MM-DD HH-mm-ss"
      value-format="YYYY-MM-DD HH-mm-ss"
      range-separator="至"
      start-placeholder="开始日期"
      end-placeholder="结束日期"
      @change="f"
  >
  </el-date-picker>

</template>
<script setup>
  import {ref} from "vue";

  const rq = ref('');
  const time = ref('');
  const times = ref('');

  const f = () => {
    console.log(times)
  }
</script>


<style scoped>

</style>